<template>
    <div>
        <div class="center-bj">
            <span class="yys-box">
                <img class="yys-img" src="../../../static/img/yys.png" alt="">
                <em class="yys-name">营养师</em>
            </span>
            <img class="yys-pic" :src="info.avatar" alt="">
            <span class="center-name">{{info.user_nickname}}</span>
        </div>
        <ul class="clearfix info-list">
            <router-link tag="li" :to="{name:'code',query:{imgPath:info.avatar}}" class="clearfix b-g-f info-list-li">
                <img class="info-li-img" src="../../../static/img/qrcode.png" alt="">
                <span class="hz-qrcode">邀请患者二维码</span>
            </router-link>
            <router-link :to="{name:'myPatients'}" tag="li" class="clearfix b-g-f info-list-li">
                <img class="info-li-img" src="../../../static/img/my-huanzhe.png" alt="">
                <span class="hz-qrcode">我的患者</span>
            </router-link>
        </ul>
    </div>
</template>
<script>
export default {
    data(){
        return{
            info:{}
        }
    },
    mounted(){
        this.dietitianInfo()
    },
    methods:{
        // 营养师个人资料
        dietitianInfo(){
            this.$api.shopping.userGetInfo().then(resp=>{
                if(resp.code == 1){
                    this.info = resp.data
                }
            })
        }
    }
}
</script>

<style lang="less" scoped>
.yys-box{
    margin-top: 60px;
    display: block;
    padding-bottom: 10px;
    .yys-img{
        width: 42px;
        height: 36px;
        vertical-align: middle;
    }
    .yys-name{
        color: #fff;
        font-size: 32px;
    }
}
.yys-pic{
    margin-top: 0 !important;
}
.info-list{
    padding: 0 40px;
    .info-list-li{
        margin-top: 30px;
        background-image: url('../../../static/img/you.png');
        background-repeat: no-repeat;
        background-position: center right 30px;
        background-size: 20px;
        padding: 40px 30px;
        border-radius: 20px;
        .info-li-img{
            width: 40px;
            height: 40px;
            float: left;
        }
        .hz-qrcode{
            padding-left: 20px;
            float: left;
            line-height: 39px;
            font-size: 38px;
        }
    }
}
</style>

